<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>凡客-核对信息</title>
		<link rel="stylesheet" type="text/css" href="<?php echo __PUBLIC__?>/Home/org/bootstrap-3.3.5-dist/css/bootstrap.min.css" />
		<script src="<?php echo __PUBLIC__?>/Home/js/jquery-1.7.2.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="<?php echo __PUBLIC__?>/Home/org/bootstrap-3.3.5-dist/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>

		<link rel="stylesheet" type="text/css" href="<?php echo __PUBLIC__?>/Home/css/order.css" />
		
		

	</head>

	<body>
		<div id="top">
			<a href="<?php echo U('Index/index')?>" class="logo"><img src="<?php echo __PUBLIC__?>/Home/images/vancl-logo.png" alt="" /></a>
			<div class="right">
				<a href="" class="help">帮助中心</a>
				
			</div>
		</div>
		<!--购买流程-->
		<div id="process">
			<span>1.我的购物车</span>
			<em>2.填写核对信息单</em>
			<span>3.成功提交订单</span>
		</div>

		<!-- 选中地址 -->
		<script type="text/javascript">
			$(function(){
				// $('.addnew').first().addClass('index');
				$('.addnew').live('click', function(event) {
					$(this).addClass('index').siblings('.addnew').removeClass('index');
					$('#tijiao input[name=address]').val($(this).find('input').val());
				});
			})
		</script>
	
	<!--主题部分-->
	<div id="main">
		<div class="address">
			<h3><span>收货地址：</span></h3>
			<div class="address_add">
				<?php if(empty($address)){?>
                
					<div class="add">
						<div><span>+</span>添加新地址</div>
					</div>
				<?php }else{?>
					<?php foreach ($address as $k=>$v){?>
						<div class="addnew <?php if($v['is_def']==1){?>
                index
               <?php }?>">
							<h4><?php echo $v['consignee']?></h4>
							<p><?php echo $v['tel']?></p>
							<p><?php echo $v['district']?></p>
							<p><?php echo $v['detail']?>（<?php echo $v['postcode']?>）</p>
							<a href="javascript:;" class="edit">编辑</a>
							<input type="hidden" name="adid" value="<?php echo $v['adid']?>">
						</div>
					<?php }?>
					<label><p><span>+</span>添加新地址</p></label>
				
               <?php }?>
				<label style="display:none;"><p><span>+</span>添加新地址</p></label>
			</div>
			
		</div>
		<script type="text/javascript">
			$(function(){
				$('.dispatch .warnshow').first().addClass('index');
				$('.dispatch .warnshow').click(function() {
					$(this).addClass('index').siblings('.warnshow').removeClass('index');
				});
			})
		</script>
		<div class="dispatch">
			<h3>配送方式：</h3>
			<?php if(empty($address)){?>
                
				<div class="warn">
					请先确认“收货地址”
				</div>
			<?php }else{?>
				<div class="send">
					<label for=""><input type="radio" name="remark" value="快递" checked="checked">快递</label>
					<label for=""><input type="radio" name="remark" value="邮政速递-EMS">邮政速递-EMS</label>
					<label>乡村镇用户<a href="javascript:;">查看货到付款配送范围</a></label>
				</div>
				<div class="warnshow">
					周一至周五、工作日送货
				</div>
				<div class="warnshow">
					周六、周日、假日送货
				</div>
				<div class="warnshow">
					周一至周日、假日均可送货
				</div>
			
               <?php }?>
			<span>声明：</span>
			<p><a href="javascript:;">1. 查看货到付款配送范围</a></p>
			<p>2. 送货时间：早 8:30至 晚7:30</p>
			<p>3. 我们会努力按照您选择的时间进行配送，但因天气、交通等因素影响，您的订单有可能会有延误现象，请您谅解！ </p>
		</div>
		<div class="pay">
			<h3>支付方式：</h3>
			<?php if(empty($address)){?>
                
				<div class="warn">
					请先确认“收货地址”
				</div>
			<?php }else{?>
				<div class="warnshow">
					<p>在线支付</p>
					<span>查看银行列表</span>
					<div class="hideshow">
						<p></p>
						<img src="<?php echo __PUBLIC__?>/Home/images//Image 2.png" alt="">
					</div>
				</div>
			
               <?php }?>
			<div class="integral">
				<input type="checkbox" />
				<span>使用积分：</span>使用0积分，抵现0元。 
			</div>
			<div class="integral">
				<input type="checkbox" />
				<span>使用礼品卡：</span>
			</div>
			<span class="qr">请先确认“收货地址”或“配送方式”</span>
		</div>
	</div>
	<!-- 发票显隐js -->
	<script type="text/javascript">
		$(function(){
			var x = 0;
			$('#invoice h4').click(function() {
				if(x==0){
					$(this).parent('#invoice').animate({'height':'190px'}, 500);
					x = 1;
				}else{
					$(this).parent('#invoice').animate({'height':'47px'}, 500);
					x = 0;
				}
			});
		})
	</script>
	<!--发票-->
	<div id="invoice">
		<h4>开发票</h4>
		<h5>您需要开具发票吗？<input type="radio" />是 <input type="radio" />否</h5>
		<h6><span>*</span>客户类型：
			<select name="" id="">
				<option value="">个人</option>
				<option value="">公司</option>
				<option value="">个体工商户</option>
				<option value="">外籍</option>
				<option value="">港、澳、台</option>
			</select>
		</h6>
		<h6><span>*</span>发票抬头：
			<input type="text" name="invoicetitle" disabled="disabled" maxlength="50" value="个人"/>
		</h6>
		<h6><span>*</span>发票内容：
			<select name="" id="">
				<option value="">服装</option>
				<option value="">鞋</option>
			</select>
		</h6>
	</div>
	
	<!--商品列表-->
	<div id="shop_list">
		<span>商品清单 </span>
		<p>以下需要被勾选商品不满足7天无理由退换货请再次确认购买，非质量问题不予退换</p>
		<a href="<?php echo U('Car/index')?>">回到购物车，修改产品>></a>
	</div>
	
	<!--订单详情-->
	<form action="<?php echo U('Success/index')?>" method="post">
		<div id="order_form">
			<h5><em>订单1</em>将从  发出，预计发货后 <span> 1天 </span> 内送达</h5>

			<table cellpadding="">
				<tr>
					<th>商品名称</th>
					<th>颜色</th>
					<th>尺码</th>
					<th>单价</th>
					<th>数量</th>
					<th>优惠</th>
					<th>小计</th>
				</tr>
				<?php if(isset($_SESSION['data']['goods'])){?>
                
					<?php foreach ($_SESSION['data']['goods'] as $k=>$v){?>
					<tr>
						<td class="shop_name">
							<input type="hidden" name="goods[]" value="<?php echo $k?>">
							<a href="<?php echo U('Desc/index',array('gid'=>$v['id']))?>" target="_blank"><?php echo $v['name']?></a>
						</td>
						<?php foreach ($v['options'] as $kk=>$vv){?>
						<td><?php echo $vv?></td>
						<?php }?>
						<td>￥<?php echo $v['price']?></td>
						<td><?php echo $v['num']?></td>
						<td>-</td>
						<td>￥<?php echo $v['total']?></td>
					</tr>
					<?php }?>
				
               <?php }?>
				<tr style="border-bottom: 1px solid #7A7F89;">
					<td colspan="7"></td>
				</tr>
			</table>
		</div>
		
		<!--计算-->
		<div id="count">
			<?php if(isset($_SESSION['data'])){?>
                
					<p>商品金额小计:<span>￥<?php echo $_SESSION['data']['total']?></span>   +  运费:<span>￥0.00</span>   =  应付:<em>￥<?php echo $_SESSION['data']['total']?></em></p>
			<?php }else{?>
					<p>商品金额小计:<span>￥0</span>   +  运费:<span>￥0.00</span>   =  应付:<em>￥0</em></p>
			
               <?php }?>
		</div>
		
		<!--支付-->
		<div id="payoff">
			<?php if(isset($_SESSION['data'])){?>
                
				已支付：<span>￥0.00</span>,您还需支付：<span>￥<?php echo $_SESSION['data']['total']?></span>
			<?php }else{?>
				已支付：<span>￥0.00</span>,您还需支付：<span>￥0</span>
			
               <?php }?>
		</div>
		
		<!--提交-->
		<div id="tijiao">
			<input type="hidden" name="address" value="">
			<input type="submit" value="提交订单" />
		</div>
	</form>
	<!-- 给地址及备注赋值 -->
		<script type="text/javascript">
			$(function(){
				$('#tijiao input[name=address]').val($('.address_add .index').find('input').val());
				$('#tijiao input[name=remark]').val($('.dispatch .send').find('input').val()+'|'+$('.dispatch').find('.index').text());
			})
		</script>

	<!--网页结束-->
		<div id="bottom">
			<p>Copyright 2007 - 2016 vancl.com All Rights Reserved 出版物经营许可证新出发京批字第直xxxxx号</p>
			<div>
				<a href="" class="index_1"><img src="<?php echo __PUBLIC__?>/Home/images/cert-redlogo.gif.png"/></a>
				<a href="" class="index_2"></a>
				<a href="" class="index_3"></a>

			</div>
		</div>
		
		<!-- 添加地址框 -->
		<script type="text/javascript">
			$(function(){
				$('.add,#main .address label p').click(function() {
					$( '<div id="city"></div>' ).css( {
						width : $(document).width(),
	 					height : $(document).height(),
	 					position : 'absolute',
	 					top : 0,
	 					left : 0,
	 					zIndex : 998,
	 					opacity : 0.3,
	 					filter : 'Alpha(Opacity = 30)',
	 					backgroundColor : '#000000'
					} ).appendTo( 'body' );
					// 模态框显示
					var obj = $( '.city' );
					obj.css( {
						left : ( $( window ).width() - obj.width() ) / 2,
						top : $( document ).scrollTop() + ( $( window ).height() - obj.height() ) * 1 / 3
					} ).fadeIn();

					// 返回页面
					$('.adclose').click(function(){
						$('.city').fadeOut('slow',function(){
							$('#city').remove();
						});
						return false;
					} );
				});
				
			})
		</script>
		<!-- 城市联动 -->
		<script type="text/javascript" src="<?php echo __PUBLIC__?>/Home/js/area.js"></script>
		<script type="text/javascript">
			$(function(){
				//初始化方法
				area.init('area');
			})
		</script>
		<!-- 提示框显隐 -->
		<script type="text/javascript">
			$(function(){
				$('.city li input').blur(function() {
					if($(this).val().length==0){
						$(this).parents('li').find('.adhide').css('display', 'block');
					}else{
						$(this).parents('li').find('.adhide').css('display', 'none');
					}
				});
				$('.city li select').blur(function() {
					if($(this).val()==0){
						$(this).parents('li').find('.adhide').css('display', 'block');
					}else{
						$(this).parents('li').find('.adhide').css('display', 'none');
					}
				});
			})
		</script>

		<!-- 异步提交 -->
		<script type="text/javascript">
			$(function(){
				$('#form').submit(function() {
					var x = 1;
					// 判断是否填写内容
					$.each($('.city li input'), function(k, v) {
						if($(this).val().length==0){
							$(this).parents('li').find('.adhide').css('display', 'block');
							x = 0;
						}
					});
					if(x == 0) return false;
					// alert(1);
					var data=$('#form').serialize();
					$.ajax({
						url: '<?php echo U('ajaxAddress')?>',
						type: 'POST',
						dataType: 'json',
						data: data,
						success:function(data){
							// 弹框隐藏
							$('.city').fadeOut('slow', function(){
								$('#city').remove();
							});
							$('#form')[0].reset();

							$('#main .address .add').remove();
							var tr = '<div class="addnew"><h4>'+data.consignee+'</h4><p>'+data.tel+'</p><p>'+data.district+'</p><p>'+data.detail+'（'+data.postcode+'）</p><a href="javascript:;" class="edit">编辑</a><input type="hidden" name="adid" value="'+data.adid+'"></div>';

							// 添加进页面
							$('#main .address .address_add').prepend(tr);
							$('#main .address label').css('display', 'block');
						}
					})
					return false;
				});
			})
		</script>
		<form action="" id="form">
			<div class="city">

				<h3>收货地址</h3>
				<ul>
					<li>
						<p class="title"><span>*</span> 收&nbsp;&nbsp;货&nbsp;&nbsp;人：</p>
						<input type="text" name="consignee" placeholder="请准确填写真实姓名" class="consignee" />
						<div class="white"></div>
						<div class="adhide"><span></span><p>请准确填写真实姓名 </p></div>
					</li>
					<li>
						<p class="title"><span>*</span> 地　　区：</p>
						<select name="district[]" id="area1"></select>
						<select name="district[]" id="area2"></select>
						<select name="district[]" id="area3"></select>
						<div class="white"></div>
						<div class="adhide"><span></span><p>请选择省份 </p></div>
					</li>
					<li>
						<p class="title"><span>*</span> 详细地址：</p>
						<input type="text" name="detail" placeholder="请填写详细路名及门牌号" class="detail" />
						<em> 配送范围与配送时间 </em>
						<div class="white"></div>
						<div class="adhide"><span></span><p>请填写详细路名及门牌号 </p></div>
					</li>
					<li>
						<p class="title"><span>*</span> 邮政编码：</p>
						<input type="text" name="postcode" placeholder="请填写正确的邮政编码" class="postcode" />
						<div class="white"></div>
						<div class="adhide"><span></span><p>请填写正确的邮政编码 </p></div>
					</li>
					<li>
						<p class="title"><span>*</span>  手　　机：</p>
						<input type="text" name="tel" placeholder="请填写正确的手机号码" class="tel" />
						<div class="white"></div>
						<div class="adhide"><span></span><p>请填写正确的手机号码 </p></div>
					</li>
				</ul>
				<a href="" class="adclose">X</a>
				
				<input type="submit" value="" class="tijiao">
			</div>
		</form>
		


		<!-- 编辑地址框 -->
		<script type="text/javascript">
			$(function(){
				var x = 0;
				$('.edit').live('click', function() {
					x = $(this).parents('.addnew').index();
					// alert(x);
					$( '<div id="city"></div>' ).css( {
						width : $(document).width(),
	 					height : $(document).height(),
	 					position : 'absolute',
	 					top : 0,
	 					left : 0,
	 					zIndex : 998,
	 					opacity : 0.3,
	 					filter : 'Alpha(Opacity = 30)',
	 					backgroundColor : '#000000'
					} ).appendTo( 'body' );
					// 模态框显示
					var obj = $( '.city_edit' );
					obj.css( {
						left : ( $( window ).width() - obj.width() ) / 2,
						top : $( document ).scrollTop() + ( $( window ).height() - obj.height() ) * 1 / 3
					} ).fadeIn();

					var adid = $(this).parents('.addnew').find('input[name=adid]').val();
					// 异步拉取数据
					$.ajax({
						url: '<?php echo U('ajaxEdit')?>',
						type: 'POST',
						dataType: 'json',
						data: {adid:adid},
						success:function(data){
							$('.city_edit input[name=consignee]').val(data.consignee);
							$('.city_edit input[name=detail]').val(data.detail);
							$('.city_edit input[name=postcode]').val(data.postcode);
							$('.city_edit input[name=tel]').val(data.tel);

							$('.city_edit li.hide').html('<input type="hidden" name="adid" value="'+data.adid+'">');
							// 初始化
							area.init("areas");
							area.selected(data.district[0],data.district[1],data.district[2]);
						}
					})
					// 返回页面
					$('.adclose').click(function(){
						$('.city_edit').fadeOut('slow',function(){
							$('#city').remove();
						});
						return false;
					} );
				});

				// <!-- 编辑异步 -->
				$('#form_edit').submit(function() {
					var x = 1;
					// 判断是否填写内容
					$.each($('.city_edit li input'), function(k, v) {
						if($(this).val().length==0){
							$(this).parents('li').find('.adhide').css('display', 'block');
							x = 0;
						}
					});
					if(x == 0) return false;
					
					// alert(1);
					var data=$('#form_edit').serialize();
					$.ajax({
						url: '<?php echo U('ajaxTijiao')?>',
						type: 'POST',
						dataType: 'json',
						data: data,
						success:function(data){
							// 弹框隐藏
							$('.city_edit').fadeOut('slow', function(){
								$('#city').remove();
							});
							$('#form_edit')[0].reset();

							$('#main .address .add').remove();
							var tr = '<h4>'+data.consignee+'</h4><p>'+data.tel+'</p><p>'+data.district+'</p><p>'+data.detail+'（'+data.postcode+'）</p><a href="javascript:;" class="edit">编辑</a><input type="hidden" name="adid" value="'+data.adid+'">';

							// 添加进页面
							$('#main .address .address_add .addnew').eq(x).html(tr);
						}
					})
					return false;
				});
			})
		</script>
		<!-- 编辑 -->
		<form action="" id="form_edit">
			<div class="city_edit">
				<h3>编辑地址</h3>
				<ul>
					<li>
						<p class="title"><span>*</span> 收&nbsp;&nbsp;货&nbsp;&nbsp;人：</p>
						<input type="text" name="consignee" placeholder="请准确填写真实姓名" class="consignee" />
						<div class="white"></div>
						<div class="adhide"><span></span><p>请准确填写真实姓名 </p></div>
					</li>
					<li>
						<p class="title"><span>*</span> 地　　区：</p>
						<select name="district[]" id="areas1"></select>
						<select name="district[]" id="areas2"></select>
						<select name="district[]" id="areas3"></select>
						<div class="white"></div>
						<div class="adhide"><span></span><p>请选择省份 </p></div>
					</li>
					<li>
						<p class="title"><span>*</span> 详细地址：</p>
						<input type="text" name="detail" placeholder="请填写详细路名及门牌号" class="detail" />
						<em> 配送范围与配送时间 </em>
						<div class="white"></div>
						<div class="adhide"><span></span><p>请填写详细路名及门牌号 </p></div>
					</li>
					<li>
						<p class="title"><span>*</span> 邮政编码：</p>
						<input type="text" name="postcode" placeholder="请填写正确的邮政编码" class="postcode" />
						<div class="white"></div>
						<div class="adhide"><span></span><p>请填写正确的邮政编码 </p></div>
					</li>
					<li>
						<p class="title"><span>*</span>  手　　机：</p>
						<input type="text" name="tel" placeholder="请填写正确的手机号码" class="tel" />
						<div class="white"></div>
						<div class="adhide"><span></span><p>请填写正确的手机号码 </p></div>
					</li>
					<li class="hide"></li>
				</ul>
				<a href="" class="adclose">X</a>
				<input type="submit" value="" class="tijiao">
			</div>
			<div class="js"></div>
		</form>
	</body>

</html>